<!DOCTYPE html>
<html>
	<head>
		<script src="../jquery.js" type="text/javascript" charset="utf-8"></script>
		<script src="jquery.flot.js" type="text/javascript" charset="utf-8"></script>		
		<script type="text/javascript" charset="utf-8">
			$(document).ready(function(){
				$.get("report.php", 
				{'event':'buttonclick'}, 
				function(response){
					var json = JSON.parse(response);
					var labels = [];
					// reformat for flot
					for(var i = 0; i < json.length; i++) {
						json[i]['bars'] = {
							'show': true,
							'fillColor': json[i]['label'],
							'lineWidth': 0
						};
						json[i]['lines'] = {
							'show': false
						}
						labels.push(json[i]['label']);
					}
					var labels = 
					$.plot("#graph", json, {
						colors: labels
					});
				})
			})
		</script>
	</head>
	<body>
		<div id="graph" style="width:250px; height:300px"></div>
	</body>
</html>